<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>日志管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <link rel="stylesheet" href="css/css.css"/>
</head>
<body>
<div class="layui-container">
        <form class="layui-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">响应状态</label>
                    <div class="layui-input-inline" style="width: 120px;">
                        <select name="response">
                            <option value="200">正常</option>
                            <option value="500">异常</option>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">时间从</label>
                    <div class="layui-input-inline">
                        <input type="text" name="startTime" id="startTime" readonly class="layui-input"/>
                    </div>
                    <div class="layui-form-mid">-</div>
                    <div class="layui-input-inline">
                        <input type="text" name="endTime" id="endTime" readonly class="layui-input"/>
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="query">查询</button>
                </div>
            </div>
        </form>
    <table id="logList" lay-filter="logData" style="margin-top: -20px"></table>
</div>
<script src="layui/layui.js" charset="utf-8"></script>
<script src="js/common.js" charset="utf-8"></script>
<script>
    layui.use(['table', 'layer','laydate', 'jquery', 'form'], function () {
        var table = layui.table,
                form = layui.form
              ,laydate = layui.laydate //日期
                $ = layui.jquery;

        table.render({
            elem: '#logList'
            , url: 'log/list'
            , page: true
            , limit: 9
            , method: "get"
            , cols: [
                [
                    {field: 'number',  align: 'center', title: '序号',type:'numbers'}
                    ,{field: 'user',  align: 'center', title: '操作人'}
                    ,{field: 'url',  align: 'center', title: '路径'}
                    ,{field: 'method',  align: 'center', title: '方式'}
                    ,{field: 'ip',  align: 'center', title: 'IP'}
                    ,{field: 'classMethod',  align: 'center', title: '接收方法'}
                    ,{field: 'args',  align: 'center', title: '参数'}
                    ,{field: 'requestTime',sort:true,width:100, align: 'center', title: '请求时间'}
                    ,{field: "exception", align: 'center', title: '异常信息'}
                    ,{field: "response", align: 'center', title: '响应状态'}
                    ,{field: "spendTime", align: 'center', title: '响应时间'}
                ]
            ]

        });

        //日期时间选择器
        laydate.render({
            elem: '#startTime'
            ,type: 'datetime'
        });
        laydate.render({
            elem: '#endTime'
            ,type: 'datetime'
        });
        form.on('submit(query)', function(data){
            table.reload('logList', {
                where: data.field
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }});
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
    });
</script>

</body>
</html>